<template>
	<view class="mistake">
		<view class="header">

		</view>
		<view class="wqList">
			<view class="wqList-s" v-for="item in dataList" :key="item.id" @click="gotoWQCorrection(item)">
				<view class="topic">
					<text>{{item.indexs}}.</text>
					<text class="topic-content">{{item.question}}</text>
				</view>
				<view class="op-content">
					<text>我选择:</text>
					<text class="options">{{item.user_question_select}}</text>
					<text class="woring">错</text>
				</view>
			</view>
			<u-empty icon="	https://cdn.uviewui.com/uview/empty/history.png" v-if="flag">

			</u-empty>
		</view>
		<!-- <view class="footer">
			<image class="footerimg" src="https://wlsy.nanjingyunpeng.cn/weixin/image/footerImg.png"></image>
		</view> -->
	</view>
</template>

<script>
	import {
		questionwrongbook
	} from "@/api/api";
	export default {
		data() {
			return {
				dataList: [],
				flag: false,
				uid:"",
			}
		},

		onLoad: function(option) {
			console.log(option)
			this.uid = option.id
			this.questionwrongbook(option.id)
		},
		onUnload() {
			uni.switchTab({
				url: '/pages/home/home'
			})
		},

		methods: {
			async questionwrongbook(val) {
				let res = await questionwrongbook({
					users_question_id: val
				})
				console.log("本次错题", res)

				if (res.code == 1000) {
					res.data.forEach((item, index) => {
						this.dataList.push({
							indexs: index + 1,
							answer: item.answer,
							id: item.id,
							optiona: item.optiona,
							optionb: item.optionb,
							optionc: item.optionc,
							optiond: item.optiond,
							qid: item.qid,
							question: item.question,
							user_question_select: item.user_question_select,
						})
					})
					if (this.dataList.length == 0) {
						this.flag = true
					}
				}

			},
			gotoWQCorrection(val) {
				// const correctionData = JSON.stringify(val)
				// console.log("correctionData",val)
				console.log("correctionData", val.id, val.qid)
				uni.showToast({
					title: '已交卷',
					duration: 8000,
					icon: "none",
				});

				uni.navigateTo({
					url: `/pages/problem/mistakeCorrection?id=${val.id}&qid=${val.qid}&uid=${this.uid}`
				});
			}
		}
	}
</script>

<style scoped lang="scss">
	.mistake {
		min-height: 100%;
		background-color: #EEF7FE;
		padding: 30rpx;
		padding-top: 20rpx;
		box-sizing: border-box;

		.header {
			width: 750rpx;
			height: 40rpx;
			background: #466EE7;
			border-radius: 0rpx 0rpx 60rpx 60rpx;
			position: fixed;
			top: 0;
			left: 0;
		}

		.wqList {
			margin-top: 60rpx;
			z-index: 9999;

			.wqList-s {
				width: 690rpx;
				background: #FFFFFF;
				box-shadow: 0px 2rpx 8rpx 0px rgba(51, 51, 51, 0.05);
				border-radius: 15px 15px 15px 15px;
				opacity: 1;
				margin-top: 20rpx;
				padding: 30rpx;
				box-sizing: border-box;

				.topic {
					font-size: 30rpx;
					font-family: PingFang SC-Bold, PingFang SC;
					font-weight: bold;
					color: #333333;
					line-height: 36rpx;
					text-align: left;

					.topic-content {
						margin-left: 10rpx;
					}
				}

				.op-content {
					font-size: 32rpxpx;
					font-family: PingFang SC-Regular, PingFang SC;
					font-weight: 400;
					color: #333333;
					line-height: 38rpx;
					text-align: left;
					margin-top: 20rpx;

					.options {
						margin: 0 30rpx;
					}

					.woring {
						font-size: 32rpx;
						font-family: PingFang SC-Regular, PingFang SC;
						font-weight: 400;
						color: #CA1313;
						line-height: 38px;
					}
				}
			}
		}

		.footer {
			width: 750rpx;
			height: 324rpx;
			position: fixed;
			bottom: 0;
			left: 0;

			.footerimg {
				width: 100%;
				height: 100%;
			}
		}
	}
</style>
